<template>
  <body id="paper">
    <el-form :model="loginForm" :rules="rules" class="login-container" label-position="left"
             label-width="0px" v-loading="loading">
      
      <el-form-item style="width: 100%" >
        <router-link to="Home"><el-button type="primary" style="width: 40%;background: #505458;border: none">进入</el-button></router-link>
      </el-form-item>
      
    </el-form>


    <el-form :model="loginForm" :rules="rules" class="login-container2" label-position="left"
             label-width="0px" v-loading="loading">
      
      <el-form-item style="width: 100%" >
        <router-link to="Home"><el-button type="primary" style="width: 40%;background: #505458;border: none">进入</el-button></router-link>
      </el-form-item>
    </el-form>


    <el-form :model="loginForm" :rules="rules" class="login-container3" label-position="left"
             label-width="0px" v-loading="loading">
      
      <el-form-item style="width: 100%" >
        <router-link to="Home"><el-button type="primary" style="width: 40%;background: #505458;border: none">进入</el-button></router-link>
      </el-form-item>
    </el-form>


    <el-form :model="loginForm" :rules="rules" class="login-container4" label-position="left"
             label-width="0px" v-loading="loading">
      
      <el-form-item style="width: 100%" >
        <router-link to="Home"><el-button type="primary" style="width: 40%;background: #505458;border: none">进入</el-button></router-link>
      </el-form-item>
    </el-form>


    <el-form :model="loginForm" :rules="rules" class="login-container5" label-position="left"
             label-width="0px" v-loading="loading">
      
      <el-form-item style="width: 100%" >
        <router-link to="Home"><el-button type="primary" style="width: 40%;background: #505458;border: none">进入</el-button></router-link>
      </el-form-item>
    </el-form>
  </body>
</template>




<style>
   #paper {
    background:url("../../../static/img/carousel/dang.jpg") no-repeat;
    background-position: center;
    height: 100%;
    width: 100%;
    background-size: cover;
    position: fixed;
  }
   body{
     margin: 0;
   }
  .login-container {
    float: left;
    border-radius: 15px;
    background:url("../../../static/img/carousel/bianyi.jpg") no-repeat;
    margin-left: 50px;
    margin-top: 50px;
    width: 400px;
    padding: 200px 35px 15px 35px;
    border: 1px solid #eaeaea;
    box-shadow: 0 0 25px #cac6c6;
  }
  .login-container2 {
    float: left;
    border-radius: 15px;
    background:url("../../../static/img/carousel/database.png") no-repeat;
    margin-left: 50px;
    margin-top: 50px;
    width: 400px;
    padding: 200px 35px 15px 35px;
    border: 1px solid #eaeaea;
    box-shadow: 0 0 25px #cac6c6;
  }
  .login-container3 {
    float: left;
    border-radius: 15px;
    background:url("../../../static/img/carousel/c.png") no-repeat;
    margin-left: 50px;
    margin-top: 50px;
    width: 400px;
    padding: 200px 35px 15px 35px;
    border: 1px solid #eaeaea;
    box-shadow: 0 0 25px #cac6c6;
  }
  .login-container4 {
    float: left;
    border-radius: 15px;
    background:url("../../../static/img/carousel/移动.jpg") no-repeat;
    margin-left: 50px;
    margin-top: 50px;
    width: 400px;
    padding: 200px 35px 15px 35px;
    border: 1px solid #eaeaea;
    box-shadow: 0 0 25px #cac6c6;
  }
  .login-container5 {
    float: left;
    border-radius: 15px;
    background:url("../../../static/img/carousel/操作.png") no-repeat;
    margin-left: 50px;
    margin-top: 50px;
    width: 400px;
    padding: 200px 35px 15px 35px;
    border: 1px solid #eaeaea;
    box-shadow: 0 0 25px #cac6c6;
  }
</style>